<template>
	<view>
		<view class="edgeInsetTop"></view>
		<view class="wanl-order"> 
			<view class="address cu-list menu-avatar margin-bj radius-bock">			
				<view class="cu-item" v-if="isHF || isWY || isYK">
					<view class="cu-avatar round wanl-bg-blue"><text :class="icon"></text></view>
					<view class="content" v-if="accounts.name" @tap="userAccounts()">
						<view>							
							<text class="wanl-gray-light text-sm">{{ accounts.name }}</text>
							<text class="wanl-gray-light text-sm" v-if="!isWY">{{ accounts.mobile }}</text>
							<text class="wanl-pip margin-right-sm" v-if="!isHF">{{ accounts.account }}</text>
						</view>
					</view>
						
					<view class="content" @tap="addAccounts('add')" v-if="!accounts.name">
						<view class="text-sm wanl-pip text-cut">{{text}}</view>
					</view>	
					<view class="action" @tap="addAccounts('add')" v-if="!accounts.name">
						<text class="wlIcon-fanhui2 text-lg"></text>
					</view>	
					<view class="action" v-if="accounts.name" @tap="userAccounts()">
						<text class="wlIcon-fanhui2 text-lg"></text>
					</view>				
				</view>
				<view class="cu-item" v-else>
					<view class="cu-avatar round wanl-bg-orange"><text class="wlIcon-weizhi1"></text></view>
					<view class="content" v-if="addressData.address" @tap="userAddress()">
						<view>
							<text class="wanl-pip margin-right-sm">{{ addressData.name }}</text>
							<text class="wanl-gray-light text-sm">{{ addressData.mobile }}</text>
						</view>
						<view class="text-sm wanl-pip text-cut">{{ addressData.province}} {{ addressData.city }} {{ addressData.district }} {{ addressData.address }}</view>
					</view>
					<view class="content" @tap="addAddress('newadd')" v-else><view class="text-sm wanl-pip text-cut">点击此处填写收货地址</view></view>
					<view class="action"><text class="wlIcon-fanhui2 text-lg"></text></view>
				</view>
			</view>
			<view v-for="(shop, index) in orderData.lists" :key="index" class="lists bg-white margin-bj radius-bock">
				<view class="shopname">
					<text class="wlIcon-dianpu2 text-orange margin-right-sm"></text>
					<text class="wanl-pip text-df">{{ shop.shop_name }}</text>
				</view>
				<view class="cu-list menu-avatar">
					<view class="cu-item margin-bottom" v-for="(goods, key) in shop.products" :key="key">
						<view class="cu-avatar radius-bock" :style="{ backgroundImage: 'url(' + $wanlshop.oss(goods.image, 77, 77) + ')' }"></view>
						<view class="content">
							<view class="text-sm text-cut-2">{{ goods.title }}</view>
							<view class="wanl_sku text-sm">
								<text v-for="(item, skey) in goods.sku.difference" :key="skey">
								<block v-if="skey != 0">-</block>{{ item }}
								</text>
							</view>
						</view>
						<view class="action">
							<view class="wanl-pip text-sm text-price">{{ goods.sku.price }}</view>
							<view class="wanl-gray-light text-sm">x{{ goods.number }}</view>
						</view>
					</view>
				</view>
				<form>
					<!-- <view class="cu-form-group" v-if="cartType">
						<view class="wanl-gray-light title">购买数量</view>
						<uni-number-box :min="1" :max="orderData.lists[0].products[0].sku.stock" :value="shop.number" @change="changeNum"></uni-number-box>
					</view> -->
					<view class="cu-form-group"  v-if="!isYZH && !isWY && !isHF && !isYK">
						<view class="title">上门自提</view>				
						<switch @change="switchChange" :class="check?'checked':''" ></switch>						
					</view>
								
					<view v-if="!check || (isYZH || isWY || isHF || isYK)">
						<view class="cu-form-group" v-if="isYZH || isWY || isHF || isYK">
						<view class="wanl-black" v-if="isYZH">快递运费</view>
						<view class="picker"  v-if="isYZH"><text class="text-price margin-left-xs">0.00</text></view>
						</view>
						<view class="cu-form-group" v-else>
							<view class="wanl-black title">快递运费</view>
							<view class="picker">{{shop.freight.name}} <text class="text-price margin-left-xs">{{shop.freight.price}}</text></view>
						</view>
					</view>			
					
		
					<view class="cu-form-group align-start">
						<view class="wanl-black title">备注</view>
						<textarea maxlength="-1" v-model="shop.remarks" placeholder="订单备注可选"></textarea>
					</view>
				</form>
				<view class="text-right margin-bj text-sm">
					<text class="wanl-gray">共{{ shop.number }}件，</text>
					小计：
					<text class="text-price text-orange">{{ shop.sub_price }}</text>
				</view>
			</view>
			<view class="safeAreaBottom"> </view>
			<!-- 弹出层 -->
			<view class="WANL-MODAL text-sm" @touchmove.stop.prevent="moveHandle">
				<!-- 优惠券 -->				
			</view>
			<view class="wanlian cu-bar tabbar solid-top foot text-df">
				<view>
					<text class="wanl-gray">共{{ orderData.statis.allnum }}件，</text>
					合计：
					<text class="text-price text-orange">{{ orderData.statis.allsub }}</text>
				</view>
				<button v-if="loading" class="cu-btn round lg bg-gradual-orange margin-lr-bj">
					<text class="wlIcon-jiazai wlIconfont-spin margin-right-xs"></text> 提交中...
				</button>
				<button v-else @tap="addOrder" class="cu-btn round lg bg-gradual-orange margin-lr-bj"> 提交订单 </button>
			</view>
		</view>
	</view>
</template>

<script>
import { mapState } from 'vuex';
export default {
	data() {
		return {
			loading: false,
			reload: false,
			token: '',
			optionData: {},
			addressData: {},
			modalName: null, // 弹出层
			cartType: null,
			couponData: {},
			couponIndex: null,
			orderData: {
				lists: [],
				statis: {
					allnum: 1,
					allsub: 0
				}
			},
			icon:'wlIcon-baocundaozhuomian',
			accounts: {
				'id':'',
				account:false,
				name:false,
				mobile:''
			},
			text:'点击此处填写要充值的手机号码',
			isYZH:false,//云中鹤
			isHF:false,//话费
			isWY:false,//文娱
			isLOCAL:false,//本地生活
			isYK:false,//油卡
			isSZ:false, //数字产品
			type:1,
			check:0,
			percent:0
		};
	},
	onLoad(option) {
		this.optionData = JSON.parse(option.data);
		this.cartType = option.type;
				
		this.isYZH = option.isYZH == 'true'?true:false;//云中鹤		
		this.isHF = option.isHF == 'true'?true:false;//话费
		this.isWY = option.isWY == 'true'?true:false;//文娱
		this.isLOCAL = option.isLOCAL == 'true'?true:false;//本地生活
		this.isSZ = option.isSZ == 'true'?true:false;//数据
		this.isYK = option.isYK == 'true'?true:false;//数据

		
		if(this.isWY){
			this.text = '点击此处填写要充值的帐号';
			this.icon = 'wlIcon-31youhuiquan';
		}
		
		if(this.isYK){
			this.text = '点击此处填写要充值的油卡信息';
			this.icon = 'wlIcon-31huiyuanqia';
		}
		this.type = this.isHF?2:(this.isYZH?3:(this.isWY?4:(this.isYK?5:(this.isSZ?7:(this.isLOCAL?6:1) ))));
		console.log(this.type);
		if(this.isYZH){
			this.orderData.lists = [
				{
					shop_name:'消费券商城',
					products:[
						{
							id:this.optionData['0'].goods_id,
							title:this.optionData['0'].title,
							image:this.optionData['0'].image,
							price:this.optionData['0'].price,
							number:this.optionData['0'].number,							
							sku:{
								price:this.optionData['0'].price,
								number:this.optionData['0'].number,
								difference:[]							
							}
						}
					],
					sub_price:(this.optionData['0'].number * this.optionData['0'].price).toFixed(2),
					number:this.optionData['0'].number
				}
			];
			
		}		
		
		
		this.loadData();
		},
	computed: {
		...mapState(['user'])
	},
	methods: {
		async loadData(address_id) {
			// 1.1.6升级	
			if(this.isYZH){
				await uni.request({
					url: '/wanlshop/ddporder/getOrderGoodsList',
					method: 'POST',
					data: {
						data: this.optionData,
						address_id: address_id
					},
					// 1.1.8 升级
					complete: res => {	
						if(res.data.code != undefined && res.data.code == 0 && res.data.msg == '请添加收货地址'){							
							this.reload = true;
							this.addAddress('newadd');
						}else{						
							this.token = res.data.token;
							this.orderData.statis.allsub = (this.optionData['0'].number * this.optionData['0'].price).toFixed(2);							
							this.addressData = res.data.addressData;	
										 
						}
					}
				});				
				return;
			}
			
			await uni.request({
				url: '/wanlshop/order/getOrderGoodsList',
				method: 'POST',
				data: {
					data: this.optionData,
					address_id: address_id,
					type:this.type
				},
				// 1.1.8 升级
				complete: res => {
					if(res.data.code != undefined && res.data.code == 0 && res.data.msg == '请添加收货地址'){
						this.reload = true;
						this.addAddress('newadd');
					}else{						
						this.token = res.data.token;
						this.orderData = res.data.orderData;
						
						this.percent = res.data.percent;//送保销金比例		
						
						if(this.isHF ||this.isWY ||this.isYK ||this.isSZ){
							if(this.isHF ||this.isWY ||this.isYK){
								this.accounts = res.data.accounts;
							}
						}
						else {this.addressData = res.data.addressData;}						 
					}
				}
			});
		},
		switchChange(e) {
				if (e.detail.value) {
					this.check = 1;
				} else {
					this.check = 0;
				}
			},
		
		
		// 提交订单
		async addOrder() {
			if(this.orderData.statis.allnum === 0){
				this.$wanlshop.msg('订单异常')
				return;
			}
			let address_id = this.addressData.id;
			if(address_id === 0){
				this.$wanlshop.msg('请填写地址')
				return;
			}
			let data = {lists: [], address_id: address_id},
				cart = [];
	
			if(this.isWY || this.isHF || this.isYK){
				if(this.isYK)data.accounts = this.accounts.id;	
				else data.accounts = this.isHF?this.accounts.mobile:this.accounts.account;					
			}
			this.orderData.lists.forEach((item, index)=> {
				data.lists.push({
					shop_id: this.isYZH?0:item.shop_id,
					remarks: item.remarks,
					products: []
				});
				item.products.forEach(goods => {
					// 购物车数据
					// cart.push({
					// 	goods_id: goods.id,
					// 	sku_id: goods.sku.id
					// });
					// 商品数据			
					if(this.isYZH){
						data.lists[index].products.push({
							goods_id: goods.id,
							number: goods.number,
					        title:goods.title,
							image:goods.image,
							price:goods.price
						});
					}else{
						if('pid' in this.optionData['0'] && this.optionData['0'].pid != 0){
							data.lists[index].products.push({
								goods_id: goods.id,
								number: goods.number,
								sku_id: goods.sku1.id,
								freight_id: goods.freight_id,
								pid: this.optionData['0'].pid
							});	
						}else{
							data.lists[index].products.push({
								goods_id: goods.id,
								number: goods.number,
								sku_id: goods.sku.id,
								freight_id: goods.freight_id
							});	
						}				
					}
					
				});
			});

			if(this.isYZH || this.isHF || this.isLOCAL || this.isWY || this.isYK){
				if(this.orderData.statis.allsub > parseInt(this.$store.state.user.reim)){
					uni.showToast({title: '消费券不足',icon: 'error',position: true});
					return;
				}
			}
			
			this.loading = true;
			// 提交订单数据data
			await uni.request({
				url: this.isYZH?'/wanlshop/ddporder/addOrder':'/wanlshop/order/addOrder',
				method: 'POST',
				data: {
					order:data,
					token: this.token,
					type:this.type,
					take:this.check == 0?1:2,
					//店铺优惠券和其他 在下追加
					coupon_id: 0  
				},
				success: res => {
					this.$store.commit('statistics/order', {
						pay: this.$store.state.statistics.order.pay + res.data.list.length,
						whole: this.$store.state.statistics.order.whole + res.data.list.length
					});
		          
				
				  
		            if(this.isYZH || this.isHF || this.isWY || this.isLOCAL || this.isYK ){
						this.$wanlshop.to(`/pages/page/success?sz=1&type=pay&order_id=${res.data.list['0'].order_id}&resprice=${this.orderData.statis.allsub}&order_type=goods`);
						this.$store.commit('user/setUserInfo', {reim:parseInt(this.$store.state.user.reim)-this.orderData.statis.allsub});
		
						
						return;
					}  
					if('pid' in this.optionData['0'] && this.optionData['0'].pid != 0){
						this.$wanlshop.to(`/pages/user2/money/pay?token=${res.data.token}&data=${JSON.stringify(res.data.list)}`);
					}else{
						this.$wanlshop.to(`/pages/user2/money/pay?token=${res.data.token}&percent=${this.percent}&data=${JSON.stringify(res.data.list)}`);
					}
					
					
					
				}
			});
		},
		//添加或修改成功之后回调
		async refreshList(data, type) {
			await uni.request({
				url: '/wanlshop/address/address',
				method: 'POST',
				data: {
					data: data,
					type: 'add'
				},
				success: res => {
					this.addressData = res.data;
					// 1.1.6升级
					if(this.reload){
						this.loadData();
					}
				}
			});
		},
		//添加或修改成功之后回调
		async refreshList1(data, type) {
			await uni.request({
				url: '/wanlshop/ddporder/accounts',
				method: 'POST',
				data: {
					data: data,
					operate: 'add'
				},
				success: res => {
					this.accounts = res.data;
					// 1.1.6升级
					if(this.reload){
						this.loadData();
					}
				}
			});
		},
	
		// 修改数量
		changeNum(num){
			num = num == 0 ? 1 : num;
			this.orderData.lists[0].number = num;
			this.orderData.lists[0].products[0].number = num;
			this.orderData.statis.allnum = num;
			// 计算价格
			this.orderData.lists[0].sub_price = this.$wanlshop.bcmul(this.orderData.lists[0].products[0].sku.price, num);
			this.orderData.statis.allsub = this.$wanlshop.bcmul(this.orderData.lists[0].products[0].sku.price, num);
		},
		addAddress(type) {
			this.$wanlshop.to(`/pages/user/address/addressManage?type=${type}`);
		},
		
		addAccounts(operate) {
			this.$wanlshop.to(`/pages/user/accounts/accounts?type=${this.type}&operate=${operate}`);
		},
		userAddress() {
			this.$wanlshop.to('/pages/user/address/address?source=1');
		},
		userAccounts() {
			this.$wanlshop.to(`/pages/user/accounts/accountsList?source=1&type=${this.type}`);
		},
		// 弹出层，暂时不需要但后续版本可能需要
		showModal(name) {
			this.modalName = name;
		},
		// 关闭弹出层
		hideModal() {
			this.modalName = null;
		},
		// 数组去重并字符串
		unique(arr) {
			return Array.from(new Set(arr)).join(',');
		},
		//禁止父元素滑动
		moveHandle() {}
	}
};
</script>

<style></style>
